/*!
 * Ext JS Library 3.0.0
 * Copyright(c) 2006-2009 Ext JS, LLC
 * licensing@extjs.com
 * http://www.extjs.com/license
 */
//
// Note that these are all defined as panel configs, rather than instantiated
// as panel objects.  You could just as easily do this instead:
//
// var absolute = new Ext.Panel({ ... });
//
// However, by passing configs into the main container instead of objects, we can defer
// layout AND object instantiation until absolutely needed.  Since most of these panels
// won't be shown by default until requested, this will save us some processing
// time up front when initially rendering the page.
//
// Since all of these configs are being added into a layout container, they are
// automatically assumed to be panel configs, and so the xtype of 'panel' is
// implicit.  To define a config of some other type of component to be added into
// the layout, simply provide the appropriate xtype config explicitly.
//
/*
 * ================  Start page config  =======================
 */
// The default start page, also a simple example of a FitLayout.
/*var start = {
	id: 'start-panel',
	title: 'Start Page',
	layout: 'fit',
	bodyStyle: 'padding:25px',
	contentEl: 'start-div'  // pull existing content from the page
};
*/
var imagenPanel = new Ext.Panel
  (
    {
      id: 'imagenPanel',
      region:'west',
      html:'<div align="center" style="margin: 10px; height: 600px; width: 200px;"><div class="tuxTop"></div><div class="tuxMid" style="height: 370px; font-size:12px; font-weight: normal;"><img width="100px" height="230px" src="../images/layout-icon.gif"></div><div class="tuxFoot"></div></div>'
    }
  );

var start = {
	id:'start-panel',
	title: 'Column Layout',
    layout: 'column',
    bodyStyle: 'padding:5px',
	defaults: {bodyStyle:'padding:15px'},
    items: [imagenPanel
    ]
};

/*
 * ================  TableLayout config  =======================
 */

var usuario = {
	id: 'usuario-panel',
	title: 'Table Layout',
    layout: 'table',
	layoutConfig: {
		columns: 2
	},autoScroll: true,
	defaults: {
		bodyStyle:'padding:15px 20px',
		cellCls: 'verticalArriba'
	},
    items: [
    gridUsuario,
    registro]
};

var cursos = {
	id: 'cursos-panel',
	title: 'Table Layout',
    layout: 'table',
	layoutConfig: {
		columns: 2
	},autoScroll: true,
	defaults: {
		bodyStyle:'padding:15px 20px',
		cellCls: 'verticalArriba'
	},
    items: [
	  cursos
	  ]
};

var material = {
	id: 'material-panel',
	title: 'Table Layout',
	layout: 'table',
	layoutConfig: {
		columns: 2
	},autoScroll: true,
	defaults: {
		bodyStyle:'padding:15px 20px',
		cellCls: 'verticalArriba'
	},
    items: [
	    gridMaterial,
	    formMaterial 
	  ]
};

var metodologia = {
	id: 'metodologia-panel',
	title: 'Table Layout',
    layout: 'table',
	layoutConfig: {
		columns: 2
	},
	autoScroll: true,
	defaults: {
		bodyStyle:'padding:15px 20px',
		cellCls: 'verticalArriba'
	},
    items: [
	{
	rowspan: 3,
	 items:[formMetodologia]
	},
	{
	 items:[gridFases]
	},{
	 items:[gridActividad]
	},{
	 items:[gridArtefacto]
	}
]
};


var configuracionCurso = {
	id: 'configuracionCurso-panel',
	title: 'Table Layout',
	layout: 'table',
	layoutConfig: {
		columns: 2
	},autoScroll: true,
	defaults: {
		bodyStyle:'padding:15px 20px',
		cellCls: 'verticalArriba'
	},
    items: [
	{
	 items:[formConfiguracionCurso]
	},{
	 items:[formCongifuracionMetodologiaCurso]
	}
	  ]
};


var grupoTrabajo = {
	id: 'grupoTrabajo-panel',
	title: 'Table Layout',
	layout: 'table',
	layoutConfig: {
		columns: 2
	},autoScroll: true,
	defaults: {
		bodyStyle:'padding:15px 20px',
		cellCls: 'verticalArriba'
	},
	items: [
	      gruposTrabajo
	  ]		
};